import { BrowserRouter as Router, Routes, Route } from 'react-router-dom'

import LayoutComponent from 'pages/Layout'
import Login from 'pages/Login'
import Home from 'pages/Home'
import AuthRoute from 'components/AuthRoute'
import ArticleList from 'pages/ ArticleList'
import ArticlePublish from 'pages/ ArticlePublish'

function App() {
  return (
    <Router>
      <div className='App'>
        {/* <Link to='/login'>登录</Link>
        <Link to='/home'>首页</Link> */}
      </div>

      {/* 配置路由规则 */}
      <Routes>
        {/* 自动跳转到login登录界面 */}
        <Route index element={<Login></Login>}></Route>
        {/* 登录路由 */}
        <Route path='/login' element={<Login></Login>}></Route>
        {/* 首页路由 */}
        <Route
          path='/layout'
          element={<AuthRoute children={<LayoutComponent />}></AuthRoute>}
        >
          <Route path='home' element={<Home></Home>}></Route>
          <Route path='list' element={<ArticleList></ArticleList>}></Route>
          <Route
            path='publish'
            element={<ArticlePublish></ArticlePublish>}
          ></Route>
        </Route>
        {/* 404界面 */}
        <Route path='*' element='404 Not Found'></Route>
      </Routes>
    </Router>
  )
}

export default App
